<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>事件处理</title>
        <script type="text/javascript" src="../js/vue.js"></script>
    </head>

    <body>
        <div id="root">
            <h1>欢迎来到{{name}}</h1>
            <!-- <button v-on:click = "showInfo()">点我提示信息</button> -->
            <button @click = "showInfo1">点我提示信息1</button>
            <button @click = "showInfo2($event,66)">点我提示信息2</button>
        </div>

        <script type="text/javascript">
            const vm = new Vue({
                el:'#root',
                data:{
                    name:'一心堂'
                },
                methods:{
                  //普通函数  
                  showInfo1(event) {
                    console.log(this)//输出vm
                    console.log(vm === this)//输出true
                  },
                
                  //箭头函数
                  showInfo2:(event) =>{
                    console.log(this)//输出Window对象
                    console.log(vm === this)//输出false
                  },
                }
            })
        </script>
    </body>
</html>